/*
    通过 id 获取元素
    @param id DOM 元素的 id 名
    @return 获取到的 DOM 元素
*/
function my$(id) {
    return document.getElementById(id)
}

/*
    获取随机数 随机数的范围在 下限和上限之间   能够取到上限和下限的值
    @lower 最小值 下限
    @upper 最大值 上限
    @return 计算好的 随机数
    
*/
function getRandom1(lower, upper) {
    return Math.round(Math.random() * (upper - lower) + lower)
}
function getRandom2(lower, upper) {
    return Math.floor(Math.random() * (upper - lower + 1) + lower)
}

/* 
    获取随机的颜色 
*/
function getColor() {
    return "rgb(" + getRandom2(0, 255) + "," + getRandom2(0, 255) + "," + getRandom2(0, 255) + ")"
}


/*
    获取或者设置元素的 css 样式
    @param ele 要设置的 DOM 元素
    @param attr 要设置的 css 属性
    @param value 要设置的属性值
    @return 返回的是 获取到的元素的样式属性值
*/

function css(ele, attr, value) {
    if (value === undefined) {
        return window.getComputedStyle
            ? window.getComputedStyle(ele)[attr]
            : ele.currentStyle[attr]
    }
    ele.style[attr] = value
}
/*
    pageX/pageY 兼容处理
    @param e 事件对象
    @return {x:..,y:..}
*/
function page(e) {
    if (e.pageX) {
        return { x: e.pageX, y: e.pageY }
    } else {
        var _left = document.documentElement ? document.documentElement.scrollLeft : document.body.scrollLeft
        var _top = document.documentElement ? document.documentElement.scrollTop : document.body.scrollTop
        return { x: _left + e.clientX, y: _top + e.clientY }
    }
}
/*
    获取元素边框以内的宽度
    @param ele  DOM元素
    @return  处理后的元素的宽度
*/
function innerWidth(ele) {
    if (css(ele, "display") === "none") {
        return parseFloat(css(ele, "width")) + parseFloat(css(ele, "paddingLeft")) + parseFloat(css(ele, "paddingRight"))
    } else {
        return ele.clientWidth
    }
}
/*
    获取元素边框以内的高度
    @param ele  DOM元素
    @return  处理后的元素的高度
*/
function innerHeight(ele) {
    if (css(ele, "display") === "none") {
        return parseFloat(css(ele, "height")) + parseFloat(css(ele, "paddingTop")) + parseFloat(css(ele, "paddingBottom"))
    } else {
        return ele.clientHeight
    }
}

/*
    获取元素边框及边框以内的宽度
    @param ele  DOM元素
    @return  处理后的元素的宽度
*/
function outerWidth(ele) {
    if (css(ele, "display") === "none") {
        return parseFloat(css(ele, "width")) + parseFloat(css(ele, "paddingLeft")) + parseFloat(css(ele, "paddingRight")) + parseFloat(css(ele, "borderLeftWidth")) + parseFloat(css(ele, "borderRightWidth"))
    } else {
        return ele.offsetWidth
    }
}

/*
    获取元素边框及边框以内的高度
    @param ele  DOM元素
    @return  处理后的元素的高度
*/
function outerHeight(ele) {
    if (css(ele, "display") === "none") {
        return parseFloat(css(ele, "height")) + parseFloat(css(ele, "paddingTop")) + parseFloat(css(ele, "paddingBottom")) + parseFloat(css(ele, "borderTopWidth")) + parseFloat(css(ele, "borderBottomWidth"))
    } else {
        return ele.offsetHeight
    }
}


/*
    添加事件监听
    @param ele  DOM元素
    @param type  事件类型
    @param  callback  回调函数 事件处理函数
*/
function on(ele, type, callback) {
    if (ele.addEventListener) {
        if (type.indexOf("on") === 0) {
            type = type.slice(2)
        }
        ele.addEventListener(type, callback)
    } else {
        if (type.indexOf("on") !== 0) {
            type = "on" + type
        }
        ele.attachEvent(type, callback)
    }
} 


/*
    移除事件监听
    @param ele  DOM元素
    @param type  事件类型
    @param  callback  回调函数 要移除事件处理函数
*/
function off(ele, type, callback) {
    if (ele.removeEventListener) {
        if (type.indexOf("on") === 0) {
            type = type.slice(2)
        }
        ele.removeEventListener(type, callback)
    } else {
        if (type.indexOf("on") !== 0) {
            type = "on" + type
        }
        ele.detachEvent(type, callback)
    }
} 